var xhr = new XMLHttpRequest();
xhr.open("GET", "../coffee.php?hide=getnews");
xhr.send(null);
xhr.onreadystatechange = () => {
    if (xhr.status == 200 && xhr.readyState == 4) {
        var arr = JSON.parse(xhr.responseText);
        var bottoms = document.querySelectorAll("section main .bottom");
        arr.forEach((v, i) => {
            var div =document.createElement("div");
            div.className="box";
            div.onclick=()=>{
                location="news.html";
            }
            var bright = document.createElement("div");
            bright.className="bright";
            for (var j in v) {
                if (j == "date") {
                    var bleft=document.createElement("div");
                    bleft.className="bleft";
                    var tarr=gshtime(v[j]);
                    var day=document.createElement("div");
                    day.className="day";
                    day.innerHTML=tarr[2];
                    var yam=document.createElement("div");
                    yam.className="yam";
                    yam.innerHTML=tarr[0]+"."+tarr[1]
                    bleft.appendChild(day);
                    bleft.appendChild(yam);
                    div.appendChild(bleft);
                } else if (j == "title") {
                    var title = document.createElement("div");
                    title.className="title";
                    title.innerHTML=v[j];
                    bright.appendChild(title);
                }else if (j == "content") {
                    var p =document.createElement("p");
                    p.innerHTML=v[j];
                    bright.appendChild(p);
                }
            }
            div.appendChild(bright);
            bottoms[1].appendChild(div);
        })
    }
}



var xhr2 = new XMLHttpRequest();
xhr2.open("GET", "../coffee.php?hide=gethistory");
xhr2.send(null);
xhr2.onreadystatechange = () => {
    if (xhr2.status == 200 && xhr2.readyState == 4) {
        var arr2 = JSON.parse(xhr2.responseText);
        console.log(arr2);
        var bottoms = document.querySelectorAll("section main .bottom");
        arr2.forEach((v, i) => {
            var div =document.createElement("div");
            div.className="box2";
            div.onclick=function(){
                console.log(1)
                var b2boxs=bottoms[2].getElementsByClassName("box2");
                for(var i=0;i<b2boxs.length;i++){
                    b2boxs[i].className="box2";
                }
                this.className="box2 active";
            }
            for (var j in v) {
                if (j == "content") {
                    var title2 = document.createElement("div");
                    title2.className="title2";
                    title2.innerHTML=v[j];
                    
                }else if (j == "date") {
                    var date=document.createElement("div");
                    date.className="date";
                    date.innerHTML=gshtime2(v[j]);
                }
            }
            div.appendChild(date);
            div.appendChild(title2);
            bottoms[2].appendChild(div);
        })
    }
}

var titles=document.querySelectorAll(".top .title");
var bottoms=document.querySelectorAll(".bottom");
var s3=document.querySelector(".s3");
var banner=document.querySelector(".banner");
var chs=document.getElementsByClassName("ch");
titles.forEach((v,i)=>{
    v.onclick=function(){
    this.parentNode.className=i==0?"tlfet1":"tlfet";
    s3.innerHTML=this.firstElementChild.innerHTML;
    bottoms.forEach((val,j)=>{
        val.className="bottom";
        chs[j].className="ch";
    })
    bottoms[i].className="bottom active";
    banner.style.backgroundImage="url(../images/about/"+this.firstElementChild.innerHTML+".png)";
    chs[i].className="ch chactive";
}
})


function gshtime(daten){
    var arr=daten.split("-");
        if(arr[1]<10){
            arr[1]=arr[1].substr(1,1)
        }
    return arr;
}

function gshtime2(d){
    d=d.replace(/-/g,"/");
    return d;
}